<!DOCTYPE html>
<html>
 
<head lang="en">
    <meta charset="UTF-8">
    <title>html导出生成word文档</title>
    
</head>
 
<body>
    <div class="word">
    	<style type="text/css">
    		table {
    			border-right: 1px solid black;
    			border-bottom: 1px solid black;
    			border-collapse:collapse;
    			}
    		table td {
    			border-left: 1px solid black;
    			border-top: 1px solid black;
    			text-align: center;
    			}
    	   table td{
    	   	height: 35px;
    	   }
    	   
    		.td_title{
    			text-align: left; 
    			border-bottom: none;
    		}
    		.td_result
    		{
    			height: 100px;
    			border-top: none;
    		}
    		.td2_result
    		{
    			height: 50px;
    			border-top: none;
    		}
    	</style>
    	<table width="700px" style="font-size: 12px;" align="center" style="border:none;">
    		<tr style="height: 30px;"><td colspan="4"style="border:none;text-align: center;font-weight: bold;font-size: 15px;">涵洞经常检查记录表</td></tr>
    		<tr style="height: 30px;">
    			<td style="border:none;text-align: right;width: 15%;">项目公司：</td> 
    			<td style="border:none;text-align: left; width: 35%;"><label id="ProjectCompany"></label></td> 
    			<td style="border:none;text-align: right;width: 15%;">日常养护单位:</td>
    			<td style="border:none;text-align: left; width: 35%;"><label id="MaintenanceUnit "></label></td>
    		</tr>
    	</table>
    	<table style="clear:both; font-size: 12px;"  align="center" border="0px" width="700px">
        	<body>
        		<tr>
        			<td width="10%">路线编号及名称</td>
        			<td width="20%"><label id="RoadName"></label></td>
        			<td width="10%">涵洞类型</td>
        			<td width="10%"><label id="CulvertTypeName"></label></td>
        			<td rowspan="2" colspan="2" width="15%">是否过水涵洞</td>
        			<td rowspan="2" width="15%"><label id="OverflowOrLevel"></label></td>
        		</tr>
        		<tr>
        			<td>涵洞桩号</td>
        			<td colspan="3"><label id="Mileage"></label></td>
        		</tr>
        		<tr>
        			<td rowspan="2" colspan="2">检查内容</td>
        			<td colspan="2" >检查结果</td>
        			<td rowspan="2" colspan="3">检查情况说明</td>
        		</tr>
        		<tr>
        			<td class="result">是</td>
        			<td class="result">否</td>
        		</tr>
        		<tr>
        			<td colspan="2">进出口是否堵塞</td>
        			<td><label id="IsCheck1"></label></td>
        			<td><label id="IsCheck_1"></label></td>
        			<td colspan="3"><label id="InspectionDescribe1"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">洞内是否淤塞及排水不畅</td>
        			<td><label id="IsCheck2"></label></td>
        			<td><label id="IsCheck_2"></label></td>
        			<td colspan="3"><label id="InspectionDescribe2"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">洞口周围是否有杂物堆积</td>
        			<td><label id="IsCheck3"></label></td>
        			<td><label id="IsCheck_3"></label></td>
        			<td colspan="3"><label id="InspectionDescribe3"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">涵洞是否清洁、漏水</td>
        			<td><label id="IsCheck4"></label></td>
        			<td><label id="IsCheck_4"></label></td>
        			<td colspan="3"><label id="InspectionDescribe4"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">涵洞结构是否损坏</td>
        			<td><label id="IsCheck5"></label></td>
        			<td><label id="IsCheck_5"></label></td>
        			<td colspan="3"><label id="InspectionDescribe5"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">涵身、涵顶是否存在裂缝</td>
        			<td><label id="IsCheck6"></label></td>
        			<td><label id="IsCheck_6"></label></td>
        			<td colspan="3"><label id="InspectionDescribe6"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">
        				涵洞周围路基填土是否稳定、完整
        			</td>
        			<td><label id="IsCheck7"></label></td>
        			<td><label id="IsCheck_7"></label></td>
        			<td colspan="3"><label id="InspectionDescribe7"></label></td>
        		</tr>
        		<tr>
        			<td colspan="2">
        				
        			</td>
        			<td></td>
        			<td></td>
        			<td colspan="3"></td>
        		</tr>
        		<tr>
        			<td colspan="3" class="td_title">处理意见：</td>
        			<td colspan="4" class="td_title">处理结果：</td>
        		</tr>
        		<tr>
        			<td colspan="3" class="td_result"><label id="DealSuggest"></label></td>
        			<td colspan="4" class="td_result"><label id="DealResult"></label></td>
        		</tr>
        		<tr>
        			<td colspan="7" class="td_title">备注：<label id="Remark"></label></td>
        		</tr>
        		<tr>
        			<td>检查、记录人</td>
        			<td><label id="OperatorName"></label></td>
        			<td rowspan="2">桥梁养护工程师</td>
        			<td colspan="2" rowspan="2"></td>
        			<td colspan="2" style="text-align: left;">检查日期：</td>
        		</tr>
        		<tr>
        			<td>复核人</td>
        			<td><label id="AuditorName"></label></td>
        			<td colspan="2">2019年07月23日</td>
        		</tr>
        	</body>
        </table>
    </div>
    <input type="button" value="导出word">
    <script src="js/jquery.js"></script>
    <script type="text/javascript" src="js/FileSaver.js"></script>
    <script type="text/javascript" src="js/jquery.wordexport.js"></script>
    <script>
        $(function () {
            $("input[type='button']").click(function (event) {
                $(".word").wordExport('word文档');
            });
        })
    </script>
</body>
</html>